/* Media Component */
div#media {
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	border:1px solid #E9E8E8;
	padding: 3px;
	margin: 10px 0;
}

div#media img { display: block; }

div#media ul { 
	overflow: hidden;
}

div#media ul, div#media ul li {
	list-style: none;
	margin:0;
	padding:0;
}

div.caption { 
	background:url('../images/px.png');
	color:#fff;
	width:460px;
	padding:10px;
	position: absolute;
	bottom:0;
	left:0;
	display:none;
}

/* Opera width restriction */
.anythingBase { max-width: 32766px; }

/***********************
  COMMON SLIDER STYLING
 ***********************/
/* Overall Wrapper: 45px right & left padding for the arrows, 28px @ bottom for navigation */
div.anythingSlider {
	display: block;
	margin: 0 auto;
	overflow: visible !important; /* needed for Opera and Safari */
	position: relative;
}
/* anythingSlider viewport window */
div.anythingSlider .anythingWindow {
	overflow: hidden;
	position: relative;
	width: 100%;
	height: 100%;
}
/* anythingSlider base (original element) */
.anythingBase {
	background: transparent;
	list-style: none;
	position: absolute;
	overflow: visible !important;
	top: 0;
	left: 0;
	margin: 0;
	padding: 0;
}
/* all panels inside the slider */
.anythingBase .panel {
	position:relative;
	background: transparent;
	display: block;
	overflow: hidden;
	float: left;
	padding: 0;
	margin: 0;
}
.anythingBase .panel.vertical {
	float: none;
}

/* Navigation Arrows */
div.anythingSlider .arrow {
	top: 50%;
	position: absolute;
	display: block;
}
div.anythingSlider .arrow a, ul li.prev a, ul li.next a {
	display: block;
	height: 17px;
	margin: -8px 0 0 0; /* half height of image */
	width: 17px;
	text-align: center;
	outline: 0;
	background: url('../images/product-slider-arrows.png') no-repeat;
}

ul li.prev a, ul li.next a  {
	border:0;
	margin-top: 9px;
}

ul li.prev a { margin-right:5px; }
ul li.next a { margin-left:2px; }

/* hide text, target the span so IE7 doesn't text-indent the link */
div.anythingSlider .arrow a span, div.anythingSlider .anythingControls ul li.prev a span, div.anythingSlider .anythingControls ul li.next a span { display: block; text-indent: -9999px; }
/* back arrow */
div.anythingSlider .back { left: 10px; }
div.anythingSlider .back a, div.anythingSlider .anythingControls ul li.prev a { background-position: left top; }
div.anythingSlider .back a:hover, div.anythingSlider .back a.hover, div.anythingSlider .anythingControls ul li.prev a:hover { background-position: left bottom; }
div.anythingSlider .back.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */
/* forward arrow */
div.anythingSlider .forward { right: 10px; }
div.anythingSlider .forward a, div.anythingSlider .anythingControls ul li.next a  { background-position: right top; }
div.anythingSlider .forward a:hover, div.anythingSlider .forward a.hover, div.anythingSlider .anythingControls ul li.next a:hover { background-position: right bottom; }
div.anythingSlider .forward.disabled { display: none; } /* disabled arrows, hide or reduce opacity: opacity: .5; filter: alpha(opacity=50); */

/* Navigation Links */
.anythingControls { outline: 0; display: none;  position: absolute; }
.anythingControls ul { margin: 0; padding: 0; float: left; }
.anythingControls ul li { display: inline; }
.anythingControls ul a {
	background:#fff;
	display: inline-block;
	border:3px solid #dedede;
	-moz-border-radius:3px;
	-webkit-border-radius:3px;
	border-radius:3px;
	margin-right: 3px;
}

/* Navigation size window */
.anythingNavWindow { overflow: hidden; float: left; }


.anythingControlsBottom {
	bottom:-50px;
	left:0px;
}

.anythingControlsTop {
	top:10px;
	right:10px;	
}
